<template>
    <div class="app-container">
      <div class="app-title">
        <span>人社部</span>
      </div>
      <el-row :gutter="20">
        <el-col :span="8">
          <el-col :span="1">
            <i :class="[treeShow ? 'el-icon-s-fold treeI' : 'el-icon-s-unfold treeI']" @click="toggerTree" />
          </el-col>
          <div class="tap-fillet wtq">
            <el-radio-group v-model="activeName" style="margin-left:4rem; width:700px; height:15px; margin-top:-57px">
              <el-radio-button label="0" name="report">
                <img style="height:12px;" :src="Processedimg">
                未审核
              </el-radio-button>
              <el-radio-button label="1" name="didNotReport">
                <img style="height:12px;" :src="Untreatedimg">
                已审核
              </el-radio-button>
              <el-radio-button label="-1" name="didNotReport">
                <img style="height:12px;" :src="Untreatedimg1">
                被退回
              </el-radio-button>
              <el-radio-button label="2" name="didNotReport"><img style=" height:12px;" :src="select">变动人员
            </el-radio-button>
              <el-radio-button label="all" name="didNotReport">
                <img style="height:12px;" :src="allimgSrc">
                全部
              </el-radio-button>
            </el-radio-group>
          </div>
        </el-col>
        <!--功能按钮-->
        <div class="filter-container">
          <div class="longbuton">
            <el-col style="text-align:right;margin-top: -3px;" :span="16">
              <el-button size="small" class="filter-item" style="margin-left: 10px;" type="primary" @click="Query">
                查询
              </el-button>
              <el-button v-if="activeName === '0'" size="small" class="filter-item" style="margin-left:10px;width:100px"
                type="primary" @click="handlePersonChange">
                人员变动情况
              </el-button>
              <!-- <el-button v-if="activeName === '0'" size="small" class="filter-item" style="margin-left: 10px;width:100px;" type="primary" :loading="batchAuditBtnLoading" @click="queryAudit">
                批量审核
              </el-button> -->
              <el-button v-if="activeName == '0' | activeName == '-1'" size="small" class="filter-item"
                style="margin-left: 10px;width:100px;" type="primary" :loading="auditBtnLoading" @click="handleAudit">
                同意并报财政
              </el-button>
              <el-button v-if="activeName == '1'" size="small" class="filter-item" style="margin-left: 10px;"
                type="primary" :loading="rejectAuditBtnLoading" @click="handleRejectAudit">
                撤销审核
              </el-button>
              <el-button v-if="activeName == '0' | activeName == '-1'" size="small" class="filter-item"
                style="margin-left: 10px;" type="primary" :loading="returnedBtnLoading" @click="Reject">
                退回
              </el-button>
  
              <el-button size="small" class="filter-item" style="margin-left: 10px;" type="primary" @click="appendixOpen">
                附件管理
              </el-button>
              <el-button size="small" class="filter-item" style="margin-left: 10px;" type="primary" @click="processnode">
                审核日志
              </el-button>
            </el-col>
          </div>
        </div>
      </el-row>
  
      <div class="grid-content bg-purple" />
  
      <div ref="box" class="box">
        <div class="left" :class="[isActive ? 'wid' : 'wids']">
          <div :class="[treeShow ? 'treeShow' : 'treeNotShow']" :style="{ 'height': treeHeight + 'px' }">
            <AgencyTree class="agencyTree" @handleTreeQuery="handleTreeQuery"
              @getFirstAuthAgencyData="getFirstAuthAgencyData" />
          </div>
        </div>
        <div v-show="Show" class="resize" title="收缩侧边栏" />
      <div class="mid" :class="[isActive ? 'mids' : 'min']">
        <unitAuditChildren :key="timer" ref="chil" :tree-data="treeData" :tab-pane="activeName"
          @handleAuditBtnLoading="handleAuditBtnLoading" @handleBatchAuditBtnLoading="handleBatchAuditBtnLoading"
          @handleRejectAuditBtnLoading="handleRejectAuditBtnLoading"
          @handleReturnedBtnLoading="handleReturnedBtnLoading" v-if="activeName !=='2'"/>
        <personChangeEditNoAuditChildrenTable :key="timer" ref="chil" :tree-data="treeData" :tab-pane="activeName" :organization="organization"
          @handleAuditBtnLoading="handleAuditBtnLoading" @handleBatchAuditBtnLoading="handleBatchAuditBtnLoading"
          @handleRejectAuditBtnLoading="handleRejectAuditBtnLoading"
          @handleReturnedBtnLoading="handleReturnedBtnLoading"  v-if="activeName =='2'"/>
      </div>
      <Drag ref="icon" />
      </div>
    </div>
  </template>
  
  <script>
  import personChangeEditNoAuditChildrenTable from '@/views/personInfoMaintenance/children/personChangeEditNoAuditChildren'
  import unitAuditChildren from '@/views/unitSalaryReport/children/humanSocietyChildren'
  import AgencyTree from '@/components/tree/agencyTree'
  import Drag from '@/components/Drag'
  
  export default {
    name: 'UnitSalaryReport',
    components: { unitAuditChildren, AgencyTree, Drag ,personChangeEditNoAuditChildrenTable},
    data() {
      return {
        organization:1,
        treeHeight: null,
        isActive: true,
        Show: false,
        treeShow: false,
        treeData: '',
        timer: '',
        activeName: '0',
        param5: this.$route.params.isback,
        all: true,
        noAudit: false,
        isAudit: false,
        batchAuditBtnLoading: false,
        auditBtnLoading: false,
        rejectAuditBtnLoading: false,
        returnedBtnLoading: false,
        allimgSrc: require('@/assets/images/all.png'),
        Processedimg: require('@/assets/images/select.png'),
        Untreatedimg: require('@/assets/images/processed.png'),
        Untreatedimg1: require('@/assets/images/processed.png'),
        select: require('@/assets/images/processed.png')
      }
    },
    watch: {
      activeName(val) {
        this.timer = new Date().getTime()
        if (val === 'all') {
          this.allimgSrc = require('@/assets/images/whiteall.png')
          this.Processedimg = require('@/assets/images/blueselect.png')
          this.Untreatedimg = require('@/assets/images/processed.png')
          this.Untreatedimg1 = require('@/assets/images/processed.png')
        } else if (val === '0') {
          this.allimgSrc = require('@/assets/images/all.png')
          this.Processedimg = require('@/assets/images/select.png')
          this.Untreatedimg = require('@/assets/images/processed.png')
          this.Untreatedimg1 = require('@/assets/images/processed.png')
        } else if (val === '-1') {
          this.allimgSrc = require('@/assets/images/all.png')
          this.Processedimg = require('@/assets/images/blueselect.png')
          this.Untreatedimg1 = require('@/assets/images/blue.png')
          this.Untreatedimg = require('@/assets/images/processed.png')
        } else if(val === '2'){
        this.allimgSrc = require('@/assets/images/all.png')
        this.Processedimg = require('@/assets/images/blueselect.png')
        this.Untreatedimg1 = require('@/assets/images/blue.png')
        this.select = require('@/assets/images/processed.png')
        } else {
          this.allimgSrc = require('@/assets/images/all.png')
          this.Processedimg = require('@/assets/images/blueselect.png')
          this.Untreatedimg = require('@/assets/images/blue.png')
          this.Untreatedimg1 = require('@/assets/images/processed.png')
        }
      }
    },
    created() { this.isback() },
    mounted() {
      this.dragController()
      this.getTeHeight()
    },
    beforeMount() {
      window.addEventListener('resize', this.getTeHeight)
    },
    methods: {
      getFirstAuthAgencyData(data) {
        this.treeData = data
      },
      getTeHeight() {
        this.treeHeight = window.innerHeight - 213
      },
      // 拖拽
      dragController() {
        this.$refs.icon.dragControllerDiv()
      },
      toggerTree() {
      
        this.treeShow = !this.treeShow
        this.isActive = !this.isActive
        this.Show = !this.Show
      },
      handleTreeQuery(data) {
        if (data && data.isleaf === '1') {
          this.treeData = data
        }
      },
      // 查询
      Query() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.$refs.chil.query()
        }
      },
      processnode() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.$refs.chil.processnode()
        }
      },
      // 审核
      handleAudit() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.auditBtnLoading = true
          this.$refs.chil.handleAudit()
        }
      },
      // 打开批量审核
      queryAudit() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.batchAuditBtnLoading = true
          this.$refs.chil.queryAudit()
        }
  
      },
      handleAuditBtnLoading() {
        this.auditBtnLoading = false
      },
      handleBatchAuditBtnLoading() {
        this.batchAuditBtnLoading = false
      },
      // 撤销审核
      handleRejectAudit() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.rejectAuditBtnLoading = true
          this.$refs.chil.handleRejectAudit()
        }
      },
      handleRejectAuditBtnLoading() {
        this.rejectAuditBtnLoading = false
      },
      // 退回
      handleReturned() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.returnedBtnLoading = true
          this.$refs.chil.handleReturned()
        }
      },
      Reject() {
        this.$refs.chil.auditReject()
      },
      handleReturnedBtnLoading() {
        this.returnedBtnLoading = false
      },
      // 撤销退回
      handleRejectReturned() {
        this.$refs.chil.handleRejectReturned()
      },
      // 打开附件
      appendixOpen() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.$refs.chil.appendixOpen()
        }
      },
      // 人员变动情况
      handlePersonChange() {
        if (this.treeData && this.treeData.isleaf === '1') {
          this.$refs.chil.getPersonChange()
        }
      },
      // 如果是被退回则进入被退回页签
      isback() {
        if (this.param5 === 1) {
          this.activeName = '-1'
        }
      }
    }
  }
  </script>
  
  <style lang="scss" scoped>
  @import "~@/styles/border.scss";
  
  /*引入公共样式*/
  .app-title {
    margin-bottom: 15px;
    height: 20px;
    border-bottom: 1px solid #dcdfe6;
  }
  </style>
  